<template>
  <div class="tag">
    <h2>标签</h2>
    <div>
      <span v-for="i in tagList" :key="i.id">{{i.name}}</span>
    </div>
  </div>
</template>

<script>
import { tag } from "../../../units/api";
export default {
  data() {
    return {
     tagList: [],
    };
  },
  created() {
    this.getListAPI();
  },
  methods: {
    async getListAPI() {
      let res = await tag();
      // console.log(res, "这里是tag");
      this.tagList = structuredClone(res.data.data);
    },
  },
};
</script>

<style scoped lang="scss">
.tag {
  background-color: rgb(255, 255, 255);
  // padding: 10px;
  text-align: left;
  h2 {
    height: 30px;
    padding: 0;
    margin: 0;
    line-height: normal;
  }
  div{
    line-height: 46px;
      padding: 5px;
      display: flex;
      justify-content: start;
      flex-wrap: wrap;
    span{
      
       background-color: greenyellow;
        padding: 0 5px;
        border-radius: 10px;
        margin: 3px 5px;
    }
  }
}
</style>